<template>
  <div class="item-one" ref="itemOne" key="update">
    <div class="title">
      <span>分账明细查询</span>
      <div>
        <el-button type="primary" :disabled="exxxx" @click="LedgerRecordsExcel"
          ><i class="el-icon-download"></i>导出</el-button
        >
      </div>
    </div>
    <div class="container">
      <div class="screeningBox">
        <div class="leftBox">
            <div class="leftitem">
            <div class="block">
              <el-date-picker
                v-model="date"
                type="datetimerange"
                :picker-options="pickerOptions"
                value-format="yyyy-MM-dd HH:mm:ss"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                :clearable="false"
                :default-time="['00:00:00', '23:59:59']"
              >
              </el-date-picker>
              <el-select
                v-model="CardBindingStatusvalue"
                placeholder="分账状态"
              >
                <el-option
                  v-for="item in CardBindingStatus"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </div>
          </div>
             <div class="leftitem">
            <el-input
              v-model="SplitOrderNumber"
              placeholder="分账订单号"
              style="width: 250px"
            ></el-input>
            <el-input
              v-model="TransactionOrderNumber"
              placeholder="交易订单号"
              style="width: 250px"
            ></el-input>
          </div>
          <div class="leftitem" v-if="userinfo.rolesId != 4">
            <el-form ref="conditions" :model="conditions">
              <el-select
                v-if="
                  userinfo.rolesId == 1 ||
                  userinfo.rolesId == 8 ||
                  userinfo.rolesId == 9
                "
                class="servicelevel"
                v-model="conditions.servicelevel"
                placeholder="服务商级别"
                @change="servicelevel"
              >
                <el-option keys="1" label="一级服务商" :value="1"></el-option>
                <el-option keys="2" label="二级服务商" :value="2"></el-option>
              </el-select>
              <el-autocomplete
                v-if="
                  userinfo.rolesId == 1 ||
                  userinfo.rolesId == 8 ||
                  userinfo.rolesId == 2 ||
                  userinfo.rolesId == 9
                "
                class="servicename"
                v-model.trim="conditions.servicename"
                :fetch-suggestions="querySearch"
                placeholder="服务商名称"
                @select="serviceid"
              ></el-autocomplete>
              <el-autocomplete
                v-if="userinfo.rolesId != 5"
                class="BDname"
                v-model.trim="conditions.BDname"
                :fetch-suggestions="BDname"
                placeholder="业务经理"
                @select="BDid"
              ></el-autocomplete>
            </el-form>
          </div>
       
        
        </div>
        <div class="rightBox">
         
          <div class="rightitem">
            <el-input
              v-model="feeKeyWords"
              placeholder="手续费承担方商户号/商户名"
              style="width: 250px"
            ></el-input>
            <el-input
              v-model="splitKeyWords"
              placeholder="分账商户号/分账商户名"
              style="width: 250px"
            ></el-input>
          </div>
          <div></div>

          <div class="rightitem" style="display: flex">
            <el-select
              v-if="userinfo.rolesId != 5 && userinfo.rolesId != 6"
              v-model="channelType"
              placeholder="通道类型"
            >
              <el-option
                v-for="(item, index) in channelslist"
                :key="index"
                :label="item.options"
                :value="item.code"
              ></el-option>
            </el-select>
            <el-input
              v-model="tradeKeyWords"
              placeholder="交易商户号/交易商户名"
              style="width: 250px"
            ></el-input>
          </div>
      
          <div class="rightitem" style="padding-top: 10px">
            <el-button icon="el-icon-search" type="primary" @click="soso"
              >搜索</el-button
            >
            <el-button icon="el-icon-refresh" type="primary" @click="reset"
              >重置</el-button
            >
          </div>
        </div>
      </div>
      <div class="tableBox">
        <el-table
          ref="multipleTable"
          :data="merchantarr"
          tooltip-effect="dark"
          style="width: 100%"
          @selection-change="handleSelectionChange"
          stripe
          :header-cell-style="tableHeaderColor"
        >
          <el-table-column type="selection" width="55"></el-table-column>
          <el-table-column
            align="center"
            type="index"
            label="序号"
          ></el-table-column>
          <el-table-column
            label="分账商户名称?分账商户号"
            align="center"
            :render-header="renderheader"
            width="240"
          >
            <template slot-scope="scope">
              <div>{{ scope.row.splitMerName }}</div>
              <div>
                {{ scope.row.splitMerNo }}
              </div>
            </template>
          </el-table-column>
          <el-table-column
            prop="settleTime"
            label="分账时间"
            align="center"
            width="160"
          ></el-table-column>
          <el-table-column
            label="分账流水号?交易订单号"
            align="center"
            :render-header="renderheader"
            width="255"
          >
            <template slot-scope="scope">
              <div>{{ scope.row.splitNo }}
                 <i
                  class="el-icon-copy-document iconmove"
                  @click="copysplitNoFunc(scope.row.splitNo)"
                  v-clipboard:copy="copysplitNo"
                  v-clipboard:success="onCopy"
                  v-clipboard:error="onError"
                />
              </div>
              <div>
                {{ scope.row.tradeNo }}
                <i
                  class="el-icon-copy-document iconmove"
                  @click="copytradeNoFunc( scope.row.tradeNo )"
                  v-clipboard:copy="copytradeNo"
                  v-clipboard:success="onCopy"
                  v-clipboard:error="onError"
                />
              </div>
            </template>
          </el-table-column>
          <el-table-column
            prop="shopNo"
            label="档口号"
            align="center"
          ></el-table-column>
          <el-table-column
            prop="shopName"
            label="租户名称"
            align="center"
          ></el-table-column>
          <el-table-column
            label="订单金额?分账金额"
            align="center"
            :render-header="renderheader"
          >
            <template slot-scope="scope">
              <div>{{ scope.row.trsTotalFee }}</div>
              <div>
                {{ scope.row.trsSplitFee }}
              </div>
            </template>
          </el-table-column>
          <el-table-column
            prop="trsBearFee"
            label="分账手续费"
            align="center"
          ></el-table-column>
        
          <el-table-column
            label="分账状态"
            align="center"
            :render-header="renderheader"
          >
            <template slot-scope="scope">
              <div>
                <span
                  v-if="scope.row.trsIsSplit == '已分账'"
                  class="green">{{ scope.row.trsIsSplit }}</span>

                <span
                  v-else-if="scope.row.trsIsSplit == '分账中'"
                  class="orange">{{ scope.row.trsIsSplit }}</span>

                <span
                  v-else-if="scope.row.trsIsSplit == '分账失败'"
                  class="hui">{{ scope.row.trsIsSplit }}</span>
                <span
                  v-else-if="scope.row.trsIsSplit == '支付失败'"
                  class="hui">{{ scope.row.trsIsSplit }}</span>
                <span
                  v-else-if="scope.row.trsIsSplit == '未完成'"
                  class="hui">{{ scope.row.trsIsSplit }}</span>
                <span
                  v-else>{{ scope.row.trsIsSplit }}</span>
                
              </div>
            </template>
          </el-table-column>
          <el-table-column
            fixed="right"
            label="操作"
            width="120"
            align="center"
          >
          
          </el-table-column>
        </el-table>
        <div class="pagination">
          <el-pagination
            background
            @current-change="handleCurrentChange"
            @size-change="sizechange"
            :page-size="10"
            layout="total, sizes, prev, pager, next, jumper"
            :total="combined"
            :current-page.sync="cur_page"
          ></el-pagination>
        </div>
      </div>
      <br />
      <br />
      <!-- 提现 -->
      <el-dialog
        v-dialogDrag
        title="提现"
        :visible.sync="WithdrawalFormVisible"
        width="50%"
        :close-on-click-modal="false"
      >
        <div class="widthFrom">
          <div class="WithdrawalStyle">
            <span class="WithdrawalWordStyle">电子账户名称:</span
            ><span class="widthdralValueStyle">4756378675327</span>
          </div>
          <div class="WithdrawalStyle">
            <span class="WithdrawalWordStyle">账号:</span
            ><span class="widthdralValueStyle">75367537</span>
          </div>
          <div class="WithdrawalStyle">
            <span class="WithdrawalWordStyle">可提现余额:</span
            ><span class="widthdralValueStyle">7867885</span>
          </div>
          <div class="WithdrawalStyle">
            <span class="WithdrawalWordStyle WithdrawalWordStyle2"
              >提现余额:</span
            ><el-input
              placeholder="请输入内容"
              v-model="WithdrawalBalance"
              clearable
            >
            </el-input>
          </div>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="amend = false">取消</el-button>
          <el-button type="primary" @click="terminalupdateok">确定</el-button>
        </span>
      </el-dialog>
    </div>
  </div>
</template>

<script>
import {
  APILedgerRecordsExcel,
  getservice,
  merchantlist,
  APILedgerRecordsList,
  getBD,
  merchantexcel,
  getlabelTagList,
  getDimensionTagList,
  dictionarylist,
} from "@/api/api";
import { getSessionStorage } from "@/utils";
export default {
  name: "baseform",
  data: function () {
    return {
      copytradeNo:'',
      copysplitNo:'',
      tradeKeyWords: "",
      TransactionOrderNumber: "",
      splitKeyWords: "", //会员编号
      SplitOrderNumber: "", //手机
      mailboxNumber: "", //邮箱
      feeKeyWords: "", //商户号
      CardBindingStatus: [
        {
          value: "0",
          label: "未分账",
        },
        {
          value: "1",
          label: "已分账",
        },
        {
          value: "2",
          label: "已发起分账",
        },
        {
          value: "3",
          label: "分账失败",
        },
        {
          value: "4",
          label: "支付失败",
        },
      ],
      CardBindingStatusvalue: "", //状态

      tarminal: {
        payLogo: "",
        shopName: "",
        marid: "",
      },
      WithdrawalBalance: "", //提现余额
      WithdrawalFormVisible: false, //提现弹窗显示
      channelType: "",
      exxxx: false,
      tableData: [],
      cur_page: 1,
      cur_size: 10,
      multipleSelection: [],
      visible: false,
      servicearr: [],
      merchantarr: [],
      combined: 10,
      pageCount: "",
      channelslist: [],
      datainfo: {
        totalFee: "",
        fee: "",
        total: "",
        balance: "",
        agent1Profit: "",
        agent2Profit: "",
        bdProfit: "",
      },
      userinfo: "",
      date: "",
      loading: true,
      conditions: {
        servicelevel: "",
        servicename: "",
        stardate: "",
        enddate: "",
        serviceid: "",
        aisle: "",
        shopno: "",
        BDname: "",
        keywords: "",
      },
      dimension: "", //选择维度
      tagname: "", //标签名
      label_all: [], //标签模糊查询
      tagId: "",
      pickerOptions: {
        // 设置不能超过未来时间
        // disabledDate: (time) => {
        //   // 设置可选择的日期为今天之后的一个月内
        //   const curDate = (new Date()).getTime()
        //   // 这里算出一个月的毫秒数,这里使用30的平均值,实际中应根据具体的每个月有多少天计算
        //   const day = 31 * 24 * 3600 * 1000
        //   const dateRegion = curDate - day
        //   return time.getTime() > Date.now() - 8.64e7 ||
        //   time.getTime() < dateRegion
        // }
        // 设置不能超过当天的23:59:59
        disabledDate(time) {
          let nowDate = new Date();
          let date = {
            year: nowDate.getFullYear(),
            month: nowDate.getMonth() + 1,
            date: nowDate.getDate(),
          };
          let timeDate =
            date.year + "-" + date.month + "-" + date.date + " 23:59:59";
          let times = new Date(timeDate).getTime();
          return time.getTime() > times;
        },
      },
    };
  },
  created() {
    this.defaultTime();
    this.dictionarylist();
    this.userinfo = JSON.parse(sessionStorage.getItem("userInfo"));
    this.$store.dispatch("getNewNum", 6);
    //  this.LedgerRecordsList();
    this.getDetil();
    window.addEventListener(
      "Interactive_request",
      this.AcceptTransactionOrder.bind(this)
    );
    // this.LedgerRecordsList("1");
    // this.LedgerRecordsList();
    // if (this.userinfo.rolesId == 1) {
    //   this.conditions.servicelevel = 1;
    //   this.servicelevel("1");
    // }
    // if (this.userinfo.rolesId == 2) {
    //   this.conditions.servicelevel = 2;
    //   this.servicelevel("2");
    // } else
    if (this.userinfo.rolesId == 3) {
      this.getBD(this.userinfo.fid);
    }
    // this.dimension_menu(5)
  },
  methods: {
      //复制官方订单号
    copytradeNoFunc(item){
      this.copytradeNo = item.replace(/^\s+|\s+$/g, "");
    },
    copysplitNoFunc(item){
      this.copysplitNo = item.replace(/^\s+|\s+$/g, "");
    },
        onCopy: function (e) {
      this.$message({
        message: "复制成功",
        type: "success",
      });
      console.log("复制成功");
    },
    onError: function (e) {
      this.$message.error("复制失败");
      console.log("复制失败");
    },
    defaultTime() {
      const start = new Date();
      start.setTime(start.getTime());
      const year = start.getFullYear();
      let month = start.getMonth() + 1;
      if (month < 10) {
        month = "0" + month;
      }
      let date = start.getDate();
      if (date < 10) {
        date = "0" + date;
      }
      const date1 = year + "-" + month + "-" + date + " " + "00:00:00";
      const date2 = year + "-" + month + "-" + date + " " + "23:59:59";
      this.date = [date1, date2];
    },
    AcceptTransactionOrder() {
      this.getDetil();
    },
    getDetil() {
      this.$nextTick(function () {
        let { tradeNo } = this.$router.history.current.params;
        if (!tradeNo) return this.LedgerRecordsList();
        this.TransactionOrderNumber = tradeNo;
        this.LedgerRecordsList();
      });
    },
    //处理列表数据
    dealListDate(array) {
      for (let i = 0; i < array.length; i++) {
        array[i].trsSplitRate
          ? (array[i].trsSplitRate = array[i].trsSplitRate + "%")
          : (array[i].trsSplitRate = "-");
        if (!array[i].splitNo) array[i].splitNo = "-";
        if (!array[i].tradeNo) array[i].tradeNo = "-";
      }
      return array;
    },
    //模糊查询商户名
    searchMerchantsList(queryString, cb) {
      let sosolist = {};
      sosolist = {
        page: 1,
        size: 20,
        merchantName: this.tarminal.marid,
      };
      merchantlist(sosolist).then((res) => {
        if (res.code == 405) {
          sessionStorage.removeItem("token");
          this.$router.push("/login");
        } else {
          this.merchantarrlist = [];
          for (var i = 0; i < res.data.length; i++) {
            this.merchantarrlist.push({
              value: res.data[i].merchantName + " — " + res.data[i].merchantNo,
              id: res.data[i].id,
            });
          }
          let results = queryString
            ? this.merchantarrlist.filter(this.createFilter(queryString))
            : this.merchantarrlist;
          // 调用 callback 返回建议列表的数据
          cb(results);
        }
      });
    },
    getMerchantId(value) {
      if (value == "") {
        this.conditions.keywords = "";
      }
    },
    marid(item) {
      this.conditions.keywords = item.id;
      this.tarminal.shopName = "";
    },
    //提现
    withdrawalButton() {
      this.WithdrawalFormVisible = true;
    },
    // 跳转对账单
    joinbill() {
      this.$router.push("/bill");
    },
    // 获取所有通道type
    dictionarylist() {
      dictionarylist({ type: "channelType", status: 0,sort: "sorted", order:"DESC" }).then((res) => {
        // console.log(res);
        if (res.code == 405) {
          sessionStorage.removeItem("token");
          this.$router.push("/login");
        } else {
          this.channelslist = res.data;
        }
      });
    },
    //修改thead 背景色
    tableHeaderColor({ row, column, rowIndex, columnIndex }) {
      if (rowIndex === 0) {
        return "background-color: #F0F0F0;font-weight: 500;font-size:14px;color:#000;";
      }
    },

    joininfo(val) {
      // console.log(val)
      this.$router.push({
        path: "/businessstatisticsinfo",
        query: {
          no: val,
          date: this.date,
          channelType: this.channelType,
        },
      });
    },
    // 刷新
    refresh() {
      this.$router.go({
        path: 0,
        query: {
          t: Date.now(),
        },
      });
    },
    renderheader(h, { column, $index }) {
      return h("span", {}, [
        h("span", {}, column.label.split("?")[0]),
        h("br"),
        h("span", {}, column.label.split("?")[1]),
      ]);
    },
    // 分页导航
    handleCurrentChange(val) {
      if (this.conditions.servicelevel == 1) {
        this.LedgerRecordsList("1");
      } else if (this.conditions.servicelevel == 2) {
        this.LedgerRecordsList("2");
      } else {
        this.LedgerRecordsList("2");
      }
      this.cur_page = val;
      this.$nextTick(() => {
        document.querySelectorAll(".content")[0].scrollTop = "0";
      });
    },
    // 分页数量
    sizechange(val) {
      this.cur_size = val;
      if (this.conditions.servicelevel == 1) {
        this.LedgerRecordsList("1");
      } else if (this.conditions.servicelevel == 2) {
        this.LedgerRecordsList("2");
      } else {
        this.LedgerRecordsList("2");
      }

      this.$nextTick(() => {
        document.querySelectorAll(".content")[0].scrollTop = "0";
      });
    },
    //多选框
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    //  重置
    reset() {
      this.date = "";
      (this.tradeKeyWords = ""),
        (this.TransactionOrderNumber = ""),
        (this.splitKeyWords = ""), //会员号
        (this.SplitOrderNumber = ""), //手机
        (this.mailboxNumber = ""), //邮箱
        (this.feeKeyWords = ""), //商户号
        (this.CardBindingStatusvalue = "");
      this.conditions.servicelevel = "";
      this.conditions.servicename = "";
      this.conditions.stardate = "";
      this.conditions.enddate = "";
      this.conditions.serviceid = "";
      this.wx1code = "";
      this.cur_page = 1;
      this.conditions.BDname = "";
      this.conditions.keywords = "";
      this.conditions.BDid = "";
      this.channelType = "";
      this.dimension = "";
      this.tagname = "";
      this.tagId = "";
      if (this.userinfo.rolesId == 2) {
        this.conditions.servicelevel = 2;
      }
    },
    // 业务经理
    BDname(queryString, cb) {
      let BDarr = this.BDarr;
      let results = queryString
        ? BDarr.filter(this.createFilter(queryString))
        : BDarr;
      // 调用 callback 返回建议列表的数据
      cb(results);
    },
    BDid(item) {
      this.conditions.BDid = item.id;
    },
    serviceid(item) {
      this.conditions.serviceid = item.id;
      this.getBD(item.id);
    },
    getBD(id) {
      this.BDarr = [];
      getBD({ agentid: id }).then((res) => {
        for (var i = 0; i < res.data.rows.length; i++) {
          this.BDarr.push({
            value: res.data.rows[i].name,
            id: res.data.rows[i].id,
          });
        }
      });
    },
    // 搜索
    soso() {
      this.loading = true;
      this.cur_page = 1;
      if (!this.conditions.servicename) {
        this.conditions.serviceid = "";
      }
      if (!this.conditions.BDname) {
        this.conditions.BDid = "";
      }
      if (this.conditions.servicelevel == 1) {
        this.LedgerRecordsList("1");
      } else if (this.conditions.servicelevel == 2) {
        this.LedgerRecordsList("2");
      } else {
        this.LedgerRecordsList();
      }
    },
    // 服务商名称
    querySearch(queryString, cb) {
      let sosolist = {};
      sosolist = {
        page: 1,
        size: 20,
        type: this.conditions.servicelevel,
        keywords: this.conditions.servicename,
      };
      getservice(sosolist).then((res) => {
        // console.log(res);
        if (res.code == 405) {
          sessionStorage.removeItem("token");
          this.$router.push("/login");
        } else {
          this.servicearr = [];
          for (var i = 0; i < res.data.rows.length; i++) {
            this.servicearr.push({
              value: res.data.rows[i].agentname,
              id: res.data.rows[i].id,
            });
          }
          let results = queryString
            ? this.servicearr.filter(this.createFilter(queryString))
            : this.servicearr;
          // 调用 callback 返回建议列表的数据
          cb(results);
        }
      });
    },
    createFilter(queryString) {
      return (restaurant) => {
        return (
          restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) !==
          -1
        );
      };
    },
    // 服务商级别
    servicelevel(val) {
      this.servicearr = [];
      getservice({
        type: val,
      }).then((res) => {
        for (var i = 0; i < res.data.rows.length; i++) {
          this.servicearr.push({
            value: res.data.rows[i].agentname,
            id: res.data.rows[i].id,
          });
        }
      });
    },

    // 商户交易统计
    LedgerRecordsList(level) {
      let sosolist = (sosolist = {
        page: this.cur_page,
        size: this.cur_size,
        splitNo: this.SplitOrderNumber,
        tradeNo: this.TransactionOrderNumber,
        feeKeyWords: this.feeKeyWords,
        isSplit: this.CardBindingStatusvalue,
        splitKeyWords: this.splitKeyWords,
        // mchNo:this.conditions.keywords,
        startTime: this.date[0],
        finishTime: this.date[1],
        // keywords: this.conditions.keywords,
        bdId: this.conditions.BDid,
        channelType: this.channelType,
        tradeKeyWords: this.tradeKeyWords,
        // tagId: this.tagId,
      });
      if (level == 1) {
        sosolist.agent1Id = this.conditions.serviceid;
      } else if (level == 2) {
        sosolist.agent2Id = this.conditions.serviceid;
      }
      APILedgerRecordsList(sosolist).then((res) => {
        if (res.code == 405) {
          sessionStorage.removeItem("token");
          this.$router.push("/login");
        } else if (res.code == 200) {
          let merdata = res.data;

          this.merchantarr = this.dealListDate(merdata);

          // this.datainfo = res.data;
          this.combined = res.pageInfo.recordCount;
          this.pageCount = res.pageInfo.pageCount;
          this.loading = false;
        } else if (res.code == 500) {
          this.$message.error(res.message);
        }
      });
    },
    //维度查询标签
    dimension_menu(v) {
      this.label_all = [];
      getDimensionTagList({
        roleId: v,
      }).then((res) => {
        if (res.code == 405) {
          sessionStorage.removeItem("token");
          this.$router.push("/login");
        } else if (res.code == 200) {
          for (var i = 0; i < res.data.length; i++) {
            this.label_all.push({
              value: res.data[i].tagName,
              id: res.data[i].tagId,
            });
          }
        } else {
          this.$message.error(res.message);
        }
      });
    },
    //标签模糊
    querySearch_tag(queryString, cb) {
      let that = this;
      getDimensionTagList({
        roleId: 5,
        tagwords: this.tagname,
      }).then((res) => {
        if (res.code == 405) {
          sessionStorage.removeItem("token");
          that.$router.push("/login");
        } else if (res.code == 200) {
          that.label_all = [];
          for (var i = 0; i < res.data.length; i++) {
            that.label_all.push({
              value: res.data[i].tagName,
              id: res.data[i].tagId,
            });
          }
          let servicearr = that.label_all;
          let results = queryString
            ? servicearr.filter(that.createFilter(queryString))
            : servicearr;
          // 调用 callback 返回建议列表的数据
          cb(results);
        } else {
          that.$message.error(res.message);
        }
      });
    },
    serviceid_tag(item) {
      this.tagId = item.id;
    },

    // 导出
    LedgerRecordsExcel() {
      this.exxxx = true;
      let i = 0;
      let time = setInterval(() => {
        if (i == 60) {
          loading.close();
          this.$message.error("请求超时");
          clearInterval(time);
        } else {
          i++;
        }
      }, 1000);
      const loading = this.$loading({
        lock: true,
        text: "Loading",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)",
      });
      APILedgerRecordsExcel({
        page: this.cur_page,
        size: this.cur_size,
        splitNo: this.SplitOrderNumber,
        tradeNo: this.TransactionOrderNumber,
        feeKeyWords: this.feeKeyWords,
        isSplit: this.CardBindingStatusvalue,
        splitKeyWords: this.splitKeyWords,
        startTime: this.date[0],
        finishTime: this.date[1],
        bdId: this.conditions.BDid,
        channelType: this.channelType,
        tradeKeyWords: this.tradeKeyWords,
      }).then((res) => {
        if (res.code == 405) {
          clearInterval(time);
          sessionStorage.removeItem("token");
          this.$router.push("/login");
          loading.close();
          this.exxxx = false;
        } else if (res.code == 200) {
          clearInterval(time);
          let elink = document.createElement("a");
          elink.download = "分账明细.xls";
          elink.href = res.data.replace("http://", "https://");
          elink.click();
          loading.close();
          this.exxxx = false;
        } else {
          clearInterval(time);
          this.$message.error(res.message);
          loading.close();
          this.exxxx = false;
        }
      });
    },
  },
};
</script>
<style scoped lang='less'>
.iconmove{
  cursor:pointer;
}
.green {
  background: #97c05c;
  color: #fff;
  padding: 0 5px;
  border-radius: 10px;
}
.orange {
  background: #f29c38;
  color: #fff;
  padding: 0 5px;
  border-radius: 10px;
}
.hui {
  background: #888888;
  color: #fff;
  padding: 0 5px;
  border-radius: 10px;
}
.merId {
  width: 250px;
}
.widthFrom {
  font-size: 18px;
}
.WithdrawalStyle {
  padding-top: 10px;
  font-weight: 500;
  display: flex;
  white-space: nowrap;
}
.widthdralValueStyle {
  line-height: 32px;
}
.WithdrawalWordStyle {
  line-height: 32px;
  width: 150px;
  text-align: right;
  margin-right: 10px;
}
.WithdrawalWordStyle2 {
  width: 184px;
}
.title {
  background: #fff;
  padding: 10px 10px;
  font-size: 18px;
  font-weight: 500;
  display: flex;
  justify-content: space-between;
}
.name {
  width: 25%;
}
.screeningBox {
  width: 100%;
  display: flex;
}
.leftBox,
.rightBox {
  width: 50%;
  padding: 0 15px;
  box-sizing: border-box;
}
.leftBox > .leftitem {
  margin-bottom: 15px;
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.rightBox > .rightitem {
  margin-bottom: 15px;
}
.merchants {
  width: 50%;
}
.tableBox {
  margin-top: 20px;
}
.servicename {
  width: 43%;
}
.servicename1 {
  width: 60%;
}
.servicelevel {
  width: 23.5%;
}
.width20 {
  width: 20%;
}
.red {
  color: #f9607d;
}
.blue {
  color: #01aaef;
}
.stitle {
  padding: 5px 0;
  font-size: 18px;
}
.statistical {
  width: 100%;
  display: flex;
  justify-content: space-around;
  align-items: center;
  background: #00152a;
  color: #fff;
  padding: 12px;
  box-sizing: border-box;
  .statisticalitem {
    flex: 1;
    text-align: center;
    border-right: 1px solid rgba(255, 255, 255, 0.445);
    font-size: 13px;
    line-height: 180%;
    &:nth-last-child(1) {
      border-right: none;
    }
    .red {
      color: #f9607d;
      font-size: 18px;
    }
    .blue {
      color: #01aaef;
      font-size: 18px;
    }
  }
}
// .BDname{
//   width: 20%;
// }
</style>